<template>
    <div class="content-wrapp">
        <el-radio-group v-model="tab.countryID" @change="clickCountry" size="small">
            <el-radio-button :label="item.id" v-for="item in country" :key="item.id">{{ item.name }}</el-radio-button>
        </el-radio-group>
        <v-time ref="time"></v-time>
        <el-radio-group
            v-model="tab.activeName"
            @change="handleClick"
            size="small"
            class="realtimeSalesRadio"
        >
            <el-radio-button
                :label="item.businessUnit"
                v-for="item in nav"
                :key="item.businessUnitId"
            >{{ item.businessUnit }}</el-radio-button>
        </el-radio-group>
        <v-table ref="table" :country="country"></v-table>
    </div>
</template>
<script>
import vTime from "./time.vue";
import vTable from "./table.vue";
const ERR_OK = 200;
export default {
    data() {
        return {
            country: [
                {
                    name: "US",
                    id: "7",
                    symbol: "$"
                },
                {
                    name: "CA",
                    id: "8",
                    symbol: "C$"
                },
                {
                    name: "UK",
                    id: "2",
                    symbol: "£"
                },
                {
                    name: "DE",
                    id: "1",
                    symbol: "€"
                },
                {
                    name: "FR",
                    id: "4",
                    symbol: "€"
                },
                {
                    name: "IT",
                    id: "3",
                    symbol: "€"
                },
                {
                    name: "ES",
                    id: "5",
                    symbol: "€"
                },
                {
                    name: "JP",
                    id: "6",
                    symbol: "JPY￥"
                }
            ],
            tab: {
                countryID: "7",
                activeName: ""
            },
            nav: []
        };
    },
    created() {
        this.getFindBu();
    },
    mounted() {
        this.$refs.time.getCityTime(this.tab.countryID);
    },
    methods: {
        getFindBu() {
            this.$ajax({
                method: "get",
                url: this.GLOBAL.businessReportService + "/search/findBu"
            }).then(res => {
                if (res.data.code === ERR_OK) {
                    this.nav = res.data.data.bu;
                    this.tab.activeName = this.nav[0].businessUnit;
                    this.$refs.table.getData(this.tab);
                }
            });
        },
        clickCountry() {
            this.$refs.time.getCityTime(this.tab.countryID);
            this.$refs.table.getData(this.tab);
        },
        handleClick() {
            this.$refs.table.getData(this.tab);
        }
    },
    components: {
        vTime,
        vTable
    }
};
</script>
